<template>
	<view class="index">
		<fixedTitle centerName="帮你吖到家"></fixedTitle>
		<view class="content" :style="{'paddingTop':paddingTopHeight,'--bgcolor':bgColor}">
			<scroll-view class="scroll-class" @scroll='scrollChange' :scroll-y="true">
				<checkAddress @click='checkAddressClick' :shopAddressName='shopAddressName'></checkAddress>
				<slideShow :bannerList='banner'></slideShow>
				<options @click='optionClick'></options>
				<view class="qiang-go">
					<image :src="qiangGo" class="qiang-go-img" @tap="qiangGoClick"></image>
				</view>
				<!-- <hot-option @hotOptionClick='hotOptionClick' @moreClick='hotMoreClick'></hot-option> -->
				<seckill @seckillClick='seckillClick' @moreClick='seckillMoreClick' @tabChange='seckillTabChange'
					@getList='getList' :seckillLst='seckillLst'></seckill>

				<block v-for="(item,index) in bannerList" :key="index">
					<view v-if="item.type==2 && index==0" style="margin-top: 260rpx;">
						<distribution :itemData='item' @distributionClick='distributionClick'
							@moreClick='distributionMoreClick(item)'>
						</distribution>
					</view>

					<view v-if="item.type==2 && index>0" style="margin-top: 180rpx;">
						<!-- {{item.commodityEntitys.length>0}} -->
						<distribution :itemData='item' @distributionClick='distributionClick'
							@moreClick='distributionMoreClick(item)'>
						</distribution>
					</view>
				</block>

				<view class="end-block">
					
					
					
					<view class="txt-block">
						<view class="txt">帮你吖</view>
						<view class="txt-two">您身边7*24小时的生活小管家</view>
					</view>
					<view class="info-txt">
						<view class="left-block"></view>
						<view class="inf-txt">店铺信息</view>
						<view class="right-block"></view>
					</view>
					<view class="end-txt">帮你吖</view>
					
					
				</view>
				<view style="height: 120rpx;"></view>
			</scroll-view>
		</view>
	</view>
</template>

<script>
	import checkAddress from '@/pages/tabbar/index/components/checkAddress.vue'
	import options from '@/pages/tabbar/index/components/options.vue'
	// import hotOption from '@/pages/tabbar/index/components/hotOption.vue'
	import seckill from '@/pages/tabbar/index/components/seckill.vue'
	import distribution from '@/pages/tabbar/index/components/distribution.vue'
	export default {
		components: {
			checkAddress,
			options,
			// hotOption,
			seckill,
			distribution
		},
		data() {
			return {
				bannerList: [],
				banner: [],
				qiangGo: require('@/static/index/qiang.png'),
				paddingTopHeight: '',
				shopAddressName: '', //附近的店铺名字
				seckillType: 0, //0是进行中 1是即开始 2是已结束
				seckillLst: [],
				bgColor: "rgba(255, 200, 47, 0.24)",
				
				text:"测试"
			}
		},
		onLoad(e) {
			this.init()
			uni.setStorageSync('shopAddress', '')
			this.getStationList()
			this.getSeckillListFun()
			
			
			
			if (e) {
				let qrUrl = decodeURIComponent(e.scene)
				
				if (qrUrl) {
					let arr = qrUrl.split('=')
					uni.setStorageSync("superior_id",arr[1]||'')
					this.text = uni.getStorageSync("superior_id")
				}
			}
		},
		onShow() {
			this.shopAddressName = uni.getStorageSync('shopAddress')
			uni.removeStorageSync('couponObj')
		},
		mounted() {
			this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px'
			let contentHeight = (uni.getSystemInfoSync().statusBarHeight) + 44
			let contentHeightStyle = `${contentHeight}px`
			this.paddingTopHeight = contentHeightStyle
		},
		methods: {
			init() {
				this.$http('home.getHomePage').then(res => {
					if (res.code == 200) {
						this.bannerList = res.data.carousel
						let arrOne = this.bannerList.filter(item => {
							if (item.type == 0) {
								return item
							}
						})
						this.banner = arrOne
						let arrTwo = this.bannerList.filter(item => {
							if (item.type == 2) {
								return item.commodityEntitys.length > 0
							}
						})
						this.bannerList = arrTwo
					}
				})
			},
			scrollChange(e) {
				let scrollTop = e.detail.scrollTop
				//scrollTop==0滑动到顶部 就显示背景 
				// console.log('scrollTop',scrollTop)
				if (scrollTop < 30) {
					this.bgColor = 'rgba(255, 200, 47, 0.24)'
				}else{
					this.bgColor = '#FAFAF5FF'
				}
			},
			getSeckillListFun() {
				this.$http('goods.getSeckillList', {
					type: this.seckillType,
				}).then(res => {
					if (res.code == 200) {
						this.seckillLst = res.data.list
					}
				})
			},
			getStationList() {
				this.$http('address.getStationList', {
					latitude: '11.22',
					longitude: '22.11'
				}).then(res => {
					if (res.code == 200) {
						uni.setStorageSync("shopAddress", res.data.list[0].station_name)
						let shopAddress = uni.getStorageSync('shopAddress')
						this.shopAddressName = shopAddress
					}
				})
			},
			qiangGoClick() {
				this.loginIsShow().then(res => {
					if (res == true) {
						uni.navigateTo({
							url: '/pages/mallCoupon/index/index'
						})
					}
				})
			},
			//判断是否登录
			loginIsShow() {
				return new Promise((resolve, reject) => {
					if (this.$tools.isLogin() == true) {

						this.$http('common.getUserInfo', {
							token: this.$tools.getToken()
						}).then(res => {
							if (res.code == 200) {
								this.userInfo = res.data.userData
								uni.setStorageSync('userInfo', this.userInfo)
								resolve(true)
							}
							if (res.code == 422) {
								reject(false)
							}

						})
					} else {
						uni.switchTab({
							url: '/pages/tabbar/user/user'
						})
						reject(false)
					}
				})
			},

			checkAddressClick() {
				uni.navigateTo({
					url: '/pages/nearby/nearby'
				})
			},
			optionClick(item) {
				if (item.type == 1) {
					uni.switchTab({
						url: item.path
					})
				} else {
					uni.navigateTo({
						url: item.path
					})
				}
			},
			hotOptionClick() {
				this.loginIsShow().then(res => {
					if (res == true) {
						this.goShopDetail()
					}
				})
			},
			goShopDetail(goodsId) {

				uni.navigateTo({
					url: '/pages/shopDetail/shopDetail?goodsId=' + goodsId
				})
			},
			seckillClick(id) {
				this.loginIsShow().then(res => {
					if (res == true) {
						this.goShopDetail(id)
					}
				})
			},
			distributionClick(goodsId) {
				this.loginIsShow().then(res => {
					if (res == true) {
						this.goShopDetail(goodsId)
					}
				})
			},
			hotMoreClick() {
				this.loginIsShow().then(res => {
					if (res == true) {
						uni.navigateTo({
							url: '/pages/tabbar/index/commonLst?type=1'
						})
					}
				})
			},
			seckillMoreClick() {
				this.loginIsShow().then(res => {
					if (res == true) {
						uni.navigateTo({
							url: '/pages/tabbar/index/seckillLst'
						})
					}
				})
			},
			distributionMoreClick(item) {
				this.loginIsShow().then(res => {
					if (res == true) {
						uni.setStorageSync('distributionListt', item)
						uni.navigateTo({
							url: '/pages/tabbar/index/commonLst?type=2'
						})
					}
				})
			},
			seckillTabChange(type) {
				this.seckillType = type
				this.getSeckillListFun()
			},
			getList(type) {
				this.seckillType = type
				this.getSeckillListFun()
			}
		}
	}
</script>
<style>
	page {
		background: #FAFAF5FF;
	}
</style>
<style lang="scss" scoped>
	:root {
		// --bgColor: #fff;
		--bgcolor: rgba(255, 200, 47, 0.24);
	}

	.content {
		height: 100vh;
		box-sizing: border-box;
		padding-left: 24rpx;
		padding-right: 24rpx;
		position: relative;
	}

	.scroll-class {
		box-sizing: border-box;
		height: 100%;
	}

	.content::before {
		content: '';
		position: absolute;
		left: 0;
		right: 0;
		z-index: -1;
		height: 200rpx;
		// background: rgba(255, 200, 47, 0.24);
		background: var(--bgcolor);
	}

	.qiang-go {

		margin-top: 24rpx;

		.qiang-go-img {
			height: 208rpx;
			width: 100%;
		}
	}

	.end-block {
		margin-top: 120rpx;
		.txt-block {
			background: #fff;
		}

		.txt {
			padding-top: 30rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 30rpx;
		}

		.txt-two {
			display: flex;
			align-items: center;
			justify-content: center;
			margin-top: 24rpx;
			color: #e5e5e5;
			font-size: 28rpx;
			padding-bottom: 32rpx;
		}

		.info-txt {
			margin: 40rpx 0;
			display: flex;
			align-items: center;
			justify-content: center;

			.left-block {
				height: 1rpx;
				flex: auto;
				background: #e5e5e5;
			}

			.inf-txt {
				font-size: 28rpx;
				padding: 0 34rpx;
			}

			.right-block {
				background: #e5e5e5;
				height: 1rpx;
				flex: auto;
			}
		}

		.end-txt {

			background: #ffc82f;
			color: #fff;
			width: 260rpx;
			margin: 0 auto;
			line-height: 80rpx;
			font-size: 40rpx;
			text-align: center;
		}
	}
</style>
